<template>
  <el-dialog :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible"
             @close="clearDataList()" width="1100px">
    <basic-container>
      <el-row :gutter="20">
        <el-col :xs="24" :sm="24" :md="9">
          <div class="user__tree boxsty">
            <el-input placeholder="输入关键字进行过滤" v-model="filterText" clearable></el-input>
            <el-tree ref="tree" :data="treeData" :props="defaultProps" :filter-node-method="filterNode"
                     class="filter-tree" node-key="id" highlight-current :default-expanded-keys="[1]" accordion
                     @node-click="getNodeData"/>

          </div>
        </el-col>
        <el-col :xs="24" :sm="24" :md="10">
          <div class="user__main boxsty filter-container" style="width: 600px">
            <div class="box-card">

              <el-form ref="dataForm" :rules="rules" label-position="left"  :model="dataForm" label-width="160px">
                <el-form-item label="部门名称" prop="jgDeptName">
                  {{dataForm.jgDeptName}}
                </el-form-item>

<!--                <el-form-item label="部门全称" prop="deptAllName">-->
<!--                    {{dataForm.deptAllName}}-->
<!--                </el-form-item>-->

                <el-form-item label="机构奖金标识" prop="jgJjFlag">
                  <el-radio-group v-model="dataForm.jgJjFlag">
                    <el-radio :label="'是'">是</el-radio>
                    <el-radio :label="'否'">否</el-radio>
                  </el-radio-group>
                </el-form-item>

                <el-row>
                  <el-col :span="20">
                    <el-form-item label="奖金管理员" prop="jgGlUserName">
                      <el-input v-model="dataForm.jgGlUserName" :disabled="true" placeholder="请选择奖金管理员"/>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    &nbsp;<el-button @click="xzJiGouRenYuan('奖金')">选择</el-button>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="20">
                    <el-form-item label="机构负责人" prop="jgFzUserName">
                      <el-input v-model="dataForm.jgFzUserName" :disabled="true" placeholder="请选择机构负责人"/>
                    </el-form-item>
                  </el-col>
                  <el-col :span="4">
                    &nbsp;<el-button @click="xzJiGouRenYuan('机构')">选择</el-button>
                  </el-col>
                </el-row>
                <el-form-item label="资金项说明" prop="jgJjsm">
                  <el-input v-model="dataForm.jgJjsm" type="textarea"  :rows="2" placeholder=""/>
                </el-form-item>
              </el-form>
            </div>
          </div>
        </el-col>
      </el-row>
    </basic-container>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="dataFormSubmit()" v-if="canSubmit">确定</el-button>
      <el-button @click="clearDataList">取消</el-button>
    </span>
    <checkUser ref="checkUser" :roleShow="salaryPerson" :multiple='false' :userIds='userIds'  @getUserList="getUserList" ></checkUser>
  </el-dialog>
</template>

<script>
import {getJjList, addObj, putObj} from '@/api/jiangjin/jiangjinjjjgwh'
import { delObj, fetchTree, getObj } from '@/api/admin/dept'
import checkUser from '@/components/form/compound/selectUser'

export default {
  components:{
    checkUser
  },
  data () {
    return {
      visible: false,
      canSubmit: false,
      checkUserVisible: false,
      salaryPerson: false,
      userIds:[],
      dataForm: {
        jgDeptId:'',
        jgDeptName:'',
        jgJjFlag:'否', //机构奖金标识,
        jgGlUserId:'',
        jgGlUserName:'',
        jgFzUserId:'',
        jgFzUserName:'',
        jgJjsm:'',
        deptId:'',
        deptAllName:''
      },
      filterText: "",
      treeData: [],
      defaultProps: {
        children: 'children',
        label: 'name'
      },
      rules: {
        jgDeptName: [{ required: true, message: '请选择部门', trigger: 'blur' }]
        // jgGlUserName: [
        //   { required: true, message: '奖金管理员名称不能为空', trigger: 'blur' }
        // ],
        // jgFzUserName: [
        //   { required: true, message: '机构负责人不能为空', trigger: 'blur' }
        // ],
      }

    }
  },
  created() {
    this.getList();
  },
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val);
    }
  },
  methods: {
    //初始化清空
    initNull(){
      this.dataForm = {
        jgDeptId:'',
        jgDeptName:'',
        jgJjFlag:'否', //机构奖金标识,
        jgGlUserId:'',
        jgGlUserName:'',
        jgFzUserId:'',
        jgFzUserName:'',
        jgJjsm:'',
        deptId:'',
        deptAllName:''
      };

    },
    init (id) {
      this.dataForm.id = id || 0;
      this.visible = true;
      this.canSubmit = true;
      this.$nextTick(() => {
        this.$refs['dataForm'].resetFields()
        if (this.dataForm.id) {
          getJjList(this.dataForm.id).then(response => {
            this.dataForm = response.data.data
          })
        }
      })
    },
    getNodeData(data){
      // if (!this.formEdit) {
      //   this.formStatus = 'update'
      // }
      getObj(data.id).then(res => {
        const tData =  res.data.data;
        ////console.log(tData);
        this.dataForm["jgDeptId"] = tData.deptId;
        this.dataForm["jgDeptName"] = tData.name;

        this.dataForm["deptId"] = tData.deptId;
        this.dataForm["deptAllName"] = tData.deptName;
      })
      // this.currentId = data.id
    },
    filterNode(value, data) {
      if (!value) return true
      return data.name.indexOf(value) !== -1
    },
    getList() {
      fetchTree(this.listQuery).then(response => {
        this.treeData = response.data.data
      })
    },

    // 表单提交
    dataFormSubmit () {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
        ////console.log(this.dataForm);
        //
        // return;

          this.canSubmit = false;
          if (this.dataForm.id) {
            putObj(this.dataForm).then(data => {
              this.$notify.success('修改成功')
              this.visible = false
              this.$emit('refreshDataList')
            }).catch(() => {
              this.canSubmit = true;
            });
          } else {
            addObj(this.dataForm).then(data => {
              this.$notify.success('添加成功')
              this.visible = false
              this.$emit('refreshDataList')
            }).catch(() => {
              this.canSubmit = true;
            });
          }
        }
      })
    },
    //清空记录
    clearDataList(){
      this.userIds = [];
      this.visible = false;
      this.checkUserVisible = false;
    },
    xzJiGouRenYuan(vm){
      if(vm === "奖金")
      {
        this.salaryPerson = true;
      }else{
        this.salaryPerson = false;
      }
      //console.log('this.salaryPerson='+this.salaryPerson)
      this.$refs.checkUser.init();
    },
    //
    getUserList(data){
      //console.log(data);
      if(data.length === 0){
        return;
      }

        if(this.salaryPerson){
          this.$set(this.dataForm,'jgGlUserId',data[0].userId)
          this.$set(this.dataForm,'jgGlUserName',data[0].ryName)

        }else {
          this.$set(this.dataForm,'jgFzUserId',data[0].userId)
          this.$set(this.dataForm,'jgFzUserName',data[0].ryName)
        }

      // this.$nextTick(() => {
      //   if(this.salaryPerson){
      //     this.dataForm.jgGlUserId = data[0].userId
      //     this.dataForm.jgGlUserName = data[0].ryName
      //   }else {
      //     this.dataForm.jgFzUserName = data[0].ryName
      //     this.dataForm.jgFzUserId = data[0].userId
      //   }
      // })

      ////console.log(this.dataForm);
      ////console.log(data)
    },


  }
}
</script>
